<template>
<view class="uni-padding-wrap">
<nav-bar home :bgColor="['#CCCCCC','#CCCCCC']"  fontColor="#333333" title="首页"></nav-bar>

 <view class="header">
 	<view class="flex flex-between flex-align-center">
		
 		<text class="colf f25">
		</text>
		<!-- <view class="ssbox"> -->
			<!-- <view class="flex flex-between flex-align-center">
			
			</view> -->
		<!-- </view>	
		<uni-icons type="chat" size="25" color="#fff" style="opacity: 0.85;"></uni-icons> -->
 	</view>
	<view class="headerb">
		<image src="@/static/img/img1.png" mode="widthFix"></image>
		<view class="notice"><view class="noticem flex flex-align-center">
		     <uni-icons type="sound" class="b" color="#f00"></uni-icons>
			<swiper :indicator-dots="false" :autoplay="true" :interval="3000" :duration="500" :vertical="true" class="noticer ml10">
				<swiper-item>
					<view class="swiper-item">这是平台公告这是平台公告这是平台公告</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">这是平台公告这是平台公告这是平台公告...</view>
				</swiper-item>
				<swiper-item>
					<view class="swiper-item">这是平台公告这是平台公告这是平台公告...</view>
				</swiper-item>
			</swiper>
		</view>
		
	</view>
	</view>
 </view><!--header end-->
 
 <view class="list">
 	<view class="flex flex-between flex-align-center">
 	</view>
 	<view class="">
 		<h-function-group :list="list2" :column="3" @active="active"></h-function-group>
 	</view>
 </view>
 
 <view class="list2">
 	<view class="flex flex-between flex-align-center pl15 pb30">
 		<text class="f28 col3">操作登记</text>
 	</view>
	<view class="listm flex flex-between">
		 <h-function-group :list="list" :column="4" @active="active"></h-function-group>
	</view>
	
	
 </view>

 <!--list end-->
<uni-popup ref="message" type="message">
	<uni-popup-message :type="msgType" :message="messageText" :duration="1000"></uni-popup-message>
</uni-popup>
</view>

</template>

<script>
	import hFunctionGroup from"@/uni_modules/h-function-group/components/h-function-group/h-function-group.vue"
	/* import uniNoticeBar from "../../components/uni-ui/lib/uni-notice-bar/uni-notice-bar.vue" */
	export default {
		components:{
			/* uniIcons,
			uniNoticeBar */
			hFunctionGroup
		},
		data() {
			return {
				list:[{icon: "icon-erbiaoguanli",text: "耳标添加",id:"6",background:"#2796f2"},
						{icon: "icon-yimiao",text: "疫苗登记",id:"4",background:"#2796f2"},
						{icon: "icon-jiandaosolid",text: "阉割登记",id:"5",background:"#2796f2"},
						{icon: "icon-gaoyang",text: "产羔登记",id:"7",background:"#2796f2"},
						{icon: "icon-yaopin",text: "用药登记",id:"8",background:"#2796f2"},
						{icon: "icon-edit-outline",text: "自用登记",id:"9",background:"#2796f2"},
						{icon: "icon-siwangdengji",text: "死亡登记",id:"10",background:"#2796f2"},
						{icon: "icon-zhuanrang",text: "转让登记",id:"11",background:"#2796f2"}],
						
				list2:[{icon: "h-gdlb",text: "羊只管理",id:"1",background:"#2796f2"},
						{icon: "h-jinqian",text: "年度收入",id:"2",background:"#2796f2"},
						{icon: "h-kuaisu",text: "金融服务",id:"3",background:"#2796f2"}],
						
				msgType: 'success',
				messageText: '这是一条成功提示',
			}
		},
		onLoad() {

		},
		methods: {
			messageToggle(type, msg) {
				this.msgType = type
				this.messageText = msg
				this.$refs.message.open();
			},
			active(e){
				
				if(e.id=="2" || e.id=="3" ){
					this.messageToggle('error', "功能正在开发中")
				}else if(e.id=="1"){
					uni.navigateTo({
					  url: `/pages/resource/sheepList`
					});
					/* uni.navigateTo({
					  url: `/pages/apply-limit/apply-limit`
					}); */
				}else if(e.id=="4"){
					uni.navigateTo({
					  url: `/pages/resource/addVinccine?sheepId=`
					});
				}else if(e.id=="5"){					
					  uni.navigateTo({
					    url: `/pages/resource/addCastrate?sheepId=`
					  });
					
				}else if(e.id=="6"){
					uni.navigateTo({
					  url: `/pages/resource/addSheep`
					});
				}else if(e.id=="7"){
					uni.navigateTo({
					  url: `/pages/resource/addLabory?sheepId=`
					});
				}else if(e.id=="8"){
					uni.navigateTo({
					  url: `/pages/resource/addMedicine?sheepId=`
					});
				}else if(e.id=="9"){
					uni.navigateTo({
					  url: `/pages/resource/addSelfUse?sheepId=` 
					});
				}else if(e.id=="10"){
					uni.navigateTo({
					  url: `/pages/resource/addDeadRecord?sheepId=` 
					});
				}else if(e.id=="11"){
					uni.navigateTo({
					  url: `/pages/resource/addTransit?sheepId=` 
					});
				}else{
					this.messageToggle('success', "成功提示弹框")
				}
			}

		}
	}
</script>

<style>
	page{background: #ededed;}
	.header{ background: linear-gradient(to right, rgb(59, 93, 224), rgb(59, 93, 224));padding: 15upx 20upx 255upx; position: relative;}
	.ssbox{ background: rgba(255,255,255,0.35);  width: 530upx; border-radius: 60rpx;padding: 10upx 15upx; box-sizing: border-box;}
	.ss_input{border: none;width: 450upx;  font-size: 30upx; color: #fff; background: none; height: 45upx; line-break: 45upx;}
	.headerb{ position: absolute;left: 0; top: 70upx; width: 100%; box-sizing: border-box;padding: 0 20upx;}
	.headerb image{ width: 710upx; box-shadow: 0 10upx 10px rgba(0,0,0,0.3); border-radius: 40upx; position: relative;z-index: 10;}
	.notice{position: relative;z-index: 5;padding: 0 50upx;}
	.noticem{background: #fff;padding:55upx 30upx 15upx; border-radius: 10upx;  box-shadow: 0 0 10px rgba(0,0,0,0.3); margin-top: -45upx;}
	.noticer{width: 480upx;height: 50upx;}
	.noticer .swiper-item{white-space: nowrap;text-overflow: ellipsis; overflow: hidden; height: 50upx;line-height: 50upx; font-size: 24upx;}
	.list{padding:275upx 20upx 20upx ;}
	.list2{padding:5upx 20upx 20upx ;}
	.listm{background: #fff; border-radius: 15upx; box-shadow: 0 0 10px rgba(0,0,0,0.3); margin-bottom: 20upx;padding: 30upx;}
	.listm{background: #fff; border-radius: 15upx; box-shadow: 0 0 10px rgba(0,0,0,0.3); margin-bottom: 20upx;padding: 30upx;}
	.listmpic{border-radius: 10upx;width: 166upx;}
	.listmr{width: 460upx; display: inline-block;}
	/* #ifdef MP-WEIXIN */
		.noticer .swiper-item{margin-top: 5upx;}
	/* #endif */
	/* #ifdef MP-BAIDU */
		.noticer .swiper-item{margin-top: 3upx;}
	/* #endif */
	/* #ifdef MP-ALIPAY */
		.noticer .swiper-item{margin-top: 2upx;}
	/* #endif */
	/* #ifdef MP-QQ */
		.noticer .swiper-item{margin-top: 4upx;}
	/* #endif */
	/* #ifdef MP-TOUTIAO */
		.noticer .swiper-item{margin-top: 4upx;}
	/* #endif */
</style>
